<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1, maximum-scale=1" />
<!--<link href="css/bootstrap.min.css" rel="stylesheet"/>-->
<!--<script src="js/jquery-3.1.1.min.js" type="text/javascript"></script>-->
<!--<script src="js/bootstrap.min.js" type="text/javascript"></script>-->
	<link rel="stylesheet" type="text/css" href="__CSS__/bootstrap.min.css" media="all">
	<link rel="stylesheet" type="text/css" href="__CSS__/daterangepicker.css" />
	<script type="text/javascript" src="__JS__/jquery-3.2.0.min.js"></script>
	<script type="text/javascript" src="__JS__/bootstrap.min.js"></script>

	<title>{$title}简报</title>
<style>
body,div,img, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, iframe {
	margin: 0;
	padding: 0;
	border:none;
	outline: none;
}
body{
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
}
.row-box-color{
	padding: 10px;
}
.content-box{
	width: auto;
	padding: 0 10px;
}
.flex-box{
	width: 100%;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
}
.flex-box>div{
	width: 50%;
}
h6{
	margin: 5px 0;
}
table,table div{
	font-size: 13px;
}
.remarks{
	width: 100%;
	margin-bottom: 10px;
	font-size: 12px;
	color: #7f7f7f;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
}
.remarks p{
	width: 50%;
}
</style>
</head>
<body>
	<div class="content-box" style="margin-top: 10px;">

		<table class="table table-bordered table-striped" style="margin-bottom: 10px;">
			<tbody>
				{eq name='$jingli' value='1'}
				</tr>
				<td>渠道数据</td>
				<td>
					<div class="flex-box">
						<div>建单量：<span style="color: #f00;">{$data.qdjd.all}</span>&nbsp;对</div>
						<!--<div><a href="{:url('yiyuan_Detail',['type'=>$type,'title'=>$title])}">点击查看详情>></a></div>-->
					</div>
				</td>
				{/eq}

				</tr>

			    </tr>
			        <td>预约明细</td>
			        <td>
			        	<div class="flex-box">
							{volist name='$data.yymx.detail' id='info'}
								<div>{$info.name}：<span style="color: #f00;">{$info.num}</span>&nbsp;对</div>
							{/volist}
			        	</div>
			        </td>
			    </tr>

			    <tr>
			        <td>预约场馆</td>
			        <td>
						<div>合计：<span style="color: #f00;">{$data.yycg.all}</span>&nbsp;对</div>
			        	<div class="flex-box">
			        		<!--<div>解放碑：<span style="color: #f00;">0</span>&nbsp;对</div>-->
							{volist name='$data.yycg.detail' id='info'}
								<div>{$info.name}：<span style="color: #f00;">{$info.num}</span>&nbsp;对</div>
							{/volist}
			        	</div>
			        </td>
			    </tr>

			    <tr>
			        <td>预约日期</td>
			        <td>
			        	<div class="flex-box">
							{volist name='$data.nextmonth.detail' id='info'}
								<div>{$info.name}：<span style="color: #f00;">{$info.num}</span>&nbsp;对</div>
							{/volist}
			        	</div>
			        </td>
			    </tr>

			    <tr>
			        <td>反馈客咨成功预约</td>
			        <td>
						<div>合计：( 总：<span style="color: #f00;">{$data.fkkz.all_all}</span>&nbsp;/ 成功：<span style="color: #f00;">{$data.fkkz.all}</span>&nbsp;)对</div>
						<div class="flex-box">
							{volist name='$data.fkkz.detail' id='info'}
							<div>{$info.name}：( <span style="color: #f00;">{$info.num_all}</span>&nbsp;/ <span style="color: #f00;">{$info.num}</span>&nbsp;)对</div>
							{/volist}
						</div>
			        </td>
			    </tr>

			    <tr>
			        <td>转介绍</td>
			        <td>
			        	<div class="flex-box">
			        		<div>客资：<span style="color: #f00;">{$data.zjs.all}</span>&nbsp;对</div>
			        		<div>成功预约：<span style="color: #f00;">{$data.zjs.cgyy}</span>&nbsp;对</div>
			        	</div>
			        </td>
			    </tr>

			    <tr>
			        <td>拍摄明细</td>
			        <td>
						<div>合计：<span style="color: #f00;">{$data.cgps.all}</span>&nbsp;对</div>
						<div class="flex-box">
							{volist name='$data.cgps.detail' id='info'}
							<div>{$info.name}：<span style="color: #f00;">{$info.num}</span>&nbsp;对</div>
							{/volist}
						</div>
			        </td>
			    </tr>

			</tbody>
		</table>

		<!--<div class="remarks">-->
			<!--<p>拍摄目标：<span>{$mbdata.cgps_renwu}</span>;</p>-->
			<!--<p>邀约目标：<span>{$mbdata.cgyy_renwu}</span>;</p>-->
			<!--<p>反馈目标：<span>{$mbdata.fkkz_renwu}</span>;</p>-->
			<!--<p>转介绍目标：<span>{$mbdata.zjs_renwu}</span>;</p>-->
		<!--</div>-->

		{neq name='$jingli' value='3'}
			<div class="bar-box">
				<p style="font-size: 12px;">&#40;已完成量&nbsp;&frasl;&nbsp;目标量&#41;</p>
				{empty name='$mbdata'}
					<div style="margin-top: 15px;">
						<p style="font-size: 15px;color: #f00;text-align: center">还未设置本月目标，请先设置</p>
					</div>
				{else/}
					<!--{volist name='$mbdata' id='info' key='k'}-->
					<!--<div>-->
						<!--<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse{$k}">-->
							<!--<h6 style="color: #20A0FF;">{$info.rwlx_text | str_replace = '目标','',###}完成进度&#40;<span>{$info.all}</span>&nbsp;&frasl;&nbsp;<span>{$info.wcl.renwu}</span>&#41;</h6>-->
							<!--<div class="progress">-->
								<!--<div class="progress-bar progress-bar-{$info.color} progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: {$info.wcl.init}%">-->
									<!--{$info.wcl.init}%-->
								<!--</div>-->
								<!--{neq name='type' value='1'}-->
								<!--<div style="width: {$info.wcl.diff}%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="{$info.wcl.diff}" role="progressbar" class="progress-bar progress-bar-danger">-->
									<!--<span></span>-->
								<!--</div>-->
								<!--{/neq}-->
							<!--</div>-->
						<!--</a>-->
						<!--<div id="collapse{$k}" class="accordion-body collapse">-->
							<!--<div class="accordion-inner">-->
								<!--{volist name='$info.detail' id='vo'}-->
								<!--{$vo.name}:&nbsp;{$vo.num}&nbsp;对,-->
								<!--{/volist}-->
							<!--</div>-->
						<!--</div>-->
					<!--</div>-->
					<!--{/volist}-->

				<div>
					<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse1">
						<h6 style="color: #20A0FF;">拍摄完成进度&#40;<span>{$mbdata.cgps_all}</span>&nbsp;&frasl;&nbsp;<span>{$mbdata.cgps_renwu}</span>&#41;</h6>
						<div class="progress">
							<div class="progress-bar progress-bar-warning progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: {$mbdata.cgps_wcl}%">
								{$mbdata.cgps_wcl}%
							</div>
							{neq name='type' value='1'}
							<div style="width: {$mbdata.cgps_diff}%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="{$mbdata.cgps_diff}" role="progressbar" class="progress-bar progress-bar-danger">
								<span></span>
							</div>
							{/neq}
						</div>
					</a>
					<div id="collapse1" class="accordion-body collapse">
						<div class="accordion-inner">
							{volist name='$data.cgps.detail' id='vo'}
							{$vo.name}:&nbsp;{$vo.num}&nbsp;对,
							{/volist}
						</div>
					</div>
				</div>
				<div>
					<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse2">
						<h6 style="color: #20A0FF;">邀约完成进度&#40;<span>{$mbdata.cgyy_all}</span>&nbsp;&frasl;&nbsp;<span>{$mbdata.cgyy_renwu}</span>&#41;</h6>
						<div class="progress">
							<div class="progress-bar progress-bar-success progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: {$mbdata.cgyy_wcl}%">
								{$mbdata.cgyy_wcl}%
							</div>
							{neq name='type' value='1'}
							<div style="width: {$mbdata.cgyy_diff}%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="{$mbdata.cgyy_diff}" role="progressbar" class="progress-bar progress-bar-danger">
								<span></span>
							</div>
							{/neq}
						</div>
					</a>
					<!--<div id="collapse2" class="accordion-body collapse">-->
						<!--<div class="accordion-inner">-->
							<!--{volist name='$info.detail' id='vo'}-->
							<!--{$vo.name}:&nbsp;{$vo.num}&nbsp;对,-->
							<!--{/volist}-->
						<!--</div>-->
					<!--</div>-->
				</div>

				{eq name='$jingli' value='1'}
				<div>
					<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse3">
						<h6 style="color: #20A0FF;">反馈完成进度&#40;<span>{$mbdata.fkkz_all}</span>&nbsp;&frasl;&nbsp;<span>{$mbdata.fkkz_renwu}</span>&#41;</h6>
						<div class="progress">
							<div class="progress-bar progress-bar-info progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: {$mbdata.fkkz_wcl}%">
								{$mbdata.fkkz_wcl}%
							</div>
							{neq name='type' value='1'}
							<div style="width: {$mbdata.fkkz_diff}%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="{$mbdata.fkkz_diff}" role="progressbar" class="progress-bar progress-bar-danger">
								<span></span>
							</div>
							{/neq}
						</div>
					</a>
					<div id="collapse3" class="accordion-body collapse">
						<div class="accordion-inner">
							{volist name='$data.fkkz.detail' id='vo'}
							{$vo.name}:&nbsp;{$vo.num}&nbsp;对,
							{/volist}
						</div>
					</div>
				</div>
				<div>
					<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse4">
						<h6 style="color: #20A0FF;">转介绍完成进度&#40;<span>{$mbdata.zjs_all}</span>&nbsp;&frasl;&nbsp;<span>{$mbdata.zjs_renwu}</span>&#41;</h6>
						<div class="progress">
							<div class="progress-bar progress-bar-default progress-bar-striped active" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: {$mbdata.zjs_wcl}%">
								{$mbdata.zjs_wcl}%
							</div>
							{neq name='type' value='1'}
							<div style="width: {$mbdata.zjs_diff}%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="{$mbdata.zjs_diff}" role="progressbar" class="progress-bar progress-bar-danger">
								<span></span>
							</div>
							{/neq}
						</div>
					</a>
					<!--<div id="collapse4" class="accordion-body collapse">-->
						<!--<div class="accordion-inner">-->
							<!--{volist name='$info.detail' id='vo'}-->
							<!--{$vo.name}:&nbsp;{$vo.num}&nbsp;对,-->
							<!--{/volist}-->
						<!--</div>-->
					<!--</div>-->
				</div>
				{/eq}

				{/empty}
			</div>
		{/neq}
		
	</div>
</body>

<!--<script type="text/javascript" src="__JS__/moment.js"></script>-->
<!--<script type="text/javascript" src="__JS__/daterangepicker.js"></script>-->
<!--<script>-->
    <!--$(function() {-->
        <!--var start = moment().subtract(29, 'days');-->
        <!--var end = moment();-->
        <!--var time = $('#time');-->
        <!--chushi(time);-->
        <!--function chushi(name) {-->
            <!--if (name.val() == ''){-->
                <!--datetime(name);-->
                <!--name.val("");-->
            <!--}else{-->
                <!--name.on('focus',function () {-->
                    <!--datetime(name);-->
                <!--});-->

            <!--}-->
            <!--name.on('cancel.daterangepicker',function(ev, picker) {-->
                <!--name.val('');-->
            <!--});-->
        <!--}-->
        <!--function datetime(name) {-->
            <!--name.daterangepicker({-->
                <!--language: 'zh-CN',                                      //这里需要修改-->
                <!--startDate: start,-->
                <!--endDate: end,-->
                <!--// singleDatePicker:true,-->
                <!--ranges: {-->
                    <!--'今天': [moment(), moment()],-->
<!--//                    '昨天': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],-->
<!--//                    '过去7天': [moment().subtract(6, 'days'), moment()],-->
<!--//                    '过去30天': [moment().subtract(29, 'days'), moment()],-->
                    <!--'这个月': [moment().startOf('month'), moment().endOf('month')],-->
<!--//                    '上个月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],-->
                    <!--// '清除':  [qingchu(name)],-->
                <!--},-->
                <!--locale: {-->
                    <!--direction:"ltr",-->
                    <!--format: "YYYY-MM-DD",-->
                    <!--separator: "~",-->
                    <!--applyLabel: '确定',-->
                    <!--cancelLabel: '清除',-->
                    <!--fromLabel: '起始时间',-->
                    <!--toLabel: '结束时间',-->
                    <!--customRangeLabel: '自定义',-->
                    <!--daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],-->
                    <!--monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',-->
                        <!--'七月', '八月', '九月', '十月', '十一月', '十二月'],-->
                    <!--firstDay: 1-->
                <!--}-->

            <!--});-->
        <!--}-->
    <!--});-->


	<!--var ygroup_id = $('#ygroup_id');-->
	<!--var yykf = $('#yykf');-->
    <!--ygroup_id.change(function () {-->
        <!--yykf.empty();-->
        <!--$("<option value=''>"+'请选择邀约客服'+"</optinon>").appendTo( yykf );-->
        <!--$.post("/mobile/jianbao/getYykf", {ygroup_id:$(this).val()},function(data){-->
            <!--if(data.code!=0){-->
                <!--$.each(eval(data),function(i,n){-->
                    <!--$("<option value='"+n.id+"'>"+n.username+"</optinon>").appendTo(yykf);-->
                <!--});-->
            <!--}-->
        <!--});-->
    <!--});-->
<!--</script>-->
</html>
